<template>
  <div>
    <Comment
      v-if="Object.keys(data).length"
      :comment-list="data.commentList"
      :comment-num="data.commentNum"
      :user-image="data.userImage"
      :author-id="data.authorId"
      @doSend="doSend($event)"
      @doChidSend="doChildSend(arguments)"
    />

  </div>
</template>

<script>
import Comment from '@/components/comment/Comment'

import { getComments, sendChildMessage, sendMessage } from '@/networks/comment'

export default {
  name: 'MyComment',
  components: { Comment },
  data() {
    return {
      data: {},
      id: -1
    }
  },
  activated() {
    console.log(this.id, this.$route.query.id)
    if (this.id !== this.$route.query.id) {
      this.init()
      this.id = this.$route.query.id
    }
  },
  methods: {
    doSend(content) {
      sendMessage({
        content: content,
        blogId: this.$route.query.id
      }).then(res => {
        this.$message.success(res.data.msg)
        this.init()
      })
    },
    doChildSend(args) {
      sendChildMessage({
        content: args[0],
        targetId: args[1],
        commentId: args[2]
      }).then(res => {
        this.$message.success(res.data.msg)
        this.init()
      })
    },
    init() {
      getComments({ id: this.$route.query.id })
        .then(res => {
          this.data = {}
          this.data = res.data.data
        })
    }
  }
}
</script>

<style scoped>

</style>
